import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

const path = require('path')

export default defineConfig({
  plugins: [vue()],
  base: './', // 设置打包路径
  resolve: {
    alias: {
      '@': path.resolve(__dirname, 'src'),
      static: path.resolve(__dirname, 'public/static'),
      utils: path.resolve(__dirname, 'src/utils')
    }
  },
  server: {
    port: 4000, // 设置服务启动端口号
    open: true, // 设置服务启动时是否自动打开浏览器
    cors: true // 允许跨域
    // 设置代理，根据我们项目实际情况配置
    // proxy: {
    //   '/api': {
    //     target: 'http://xxx.xxx.xxx.xxx:8000',
    //     changeOrigin: true,
    //     secure: false,
    //     rewrite: (path) => path.replace('/api/', '/')
    //   }
    // }
  },

  css: {
    preprocessorOptions: {
      scss: {
        //additionalData: '@import"@/assets/css/globalstyle.scss";'
        //👆这样写是不行的。因为如果项目中其他的css文件有@forward关键字，就会提示错误
        additionalData: '@use "@/assets/styles/index.scss" as *;'
        //👆这样写是可以的，但是要注意
        //!!!!一定要将其他地方引入该css文件的地方删除，如index.html,否则会提示已经加载该module的错误！！！
      }
    },
    devSourcemap: true
  }
})
